<template>
    <div class="qopSon mianyuContent" >
        <common id="nulll" ref='common'></common>
        <div id="echart_boxMianyu" class="">
            <div>
                <div class="conP clear_float">
                    <div>排行</div> <div>区县</div> <div>近1小时</div> <div>近3小时</div> <div>近24小时</div>
                    <div>未来1小时</div> <div>未来3小时</div> <div>未来24小时</div> 
                </div>
                <div class="conP clear_float" v-for="(item , index) of word" :key="index">
                    <div >{{index+1}}</div>
                    <div >{{item.county}}</div>
                    <div >{{item.pre1h}}</div>
                    <div >{{item.pre3h}}</div>
                    <div >{{item.pre24h}}</div>
                    <div >{{item.fore1h}}</div>
                    <div >{{item.fore3h}}</div>
                    <div >{{item.fore24h}}</div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import topTitle from './top'
import echarts from 'echarts'
import common from '../common'
//import json from "../../assets/json/RainBysTationInfo.json"
export default {
    props:["msg"],
	components: {
        topTitle,common,
    },
	data() {
		return {
			title:{
				name: "雨量排行",
				time: "",
			},
            word:"",
		}
	},
	methods:{
        refreshAll(){

        },
        refreshData(){
            console.log(9999)
		},
		gedivata(){
            this.$ajax({method: 'get',	url: "http://172.21.129.156:8081/web/rain/countSurfaceRainFall	",}).then((res)=>{
                console.log(res)
                var data=res.data;
                this.title.time=this.$refs.common.timechangeShow(data.time);
                this.word=data.result;
                this.word=this.word.sort(this.$refs.common.compare2("pre1h"))
            })
            .catch(function(err){
                console.log(err)
            })
        }
    },
	mounted(){
        this.$emit('refreshTop',this.title);
        this.gedivata();
	}
}
</script>

<style lang="less">
.mianyuContent{
    height: 349px;
    font-size: 14px;
    .conP{
        &>div{
            width: 11%;
            height: 100%;
            float: left;
            text-align: center;
            border-top: 1px solid rgba(255, 255, 255, 0.1);
            padding: 17px 0;
            // font-weight: bold;
            font-size: 15px;
            &:nth-child(2){
                width: 22%;
            }
        }
        &:first-child{
            background: rgba(59, 138, 236, 0.19);
            &>div{
                border-top: none;
            }
        }
    }
}
</style>
